<div id="tableWrapperID">
  <div id="tableWrapperHeaderID">
    <span>
      <%=getAccountIndexTitle(@account_type)%>
    </span>
  </div>
  <div id="tableWrapperBodyID">
    <span class="tooltip">
        <span><%=t('tooltip.record.add')%></span>
        <%=getAddButtonLink(@account_type)%>
    </span>
    <%= form_tag(sort_accounts_path, :id =>"accountSortingFormId", :method=>:post, :remote => true, :class => "category-sorting-form") do -%>
        <div class="category-sorting-form">
          <%= hidden_field_tag "type", @account_type%>
          <%= label_tag "field", t('sorting_by'), :class => "statistic-date-label", :style => "font-weight: bold;"%>
          <%= select_tag "field", getAccountsSortingOptionList.html_safe , :id => "field"%>
          <%= select_tag "direction", getSortingDirectionOptionList.html_safe , :id => "direction"%>
        </div>
    <% end -%>
    <table id="dataTableID">
      <thead>
      <tr>
        <th id="editButtonsHeaderID">&nbsp;</th>
        <th id="accountNameHeaderID">
            <%=t('field.common.name')%>
        </th>
        <th id="accountDescriptionHeaderID">
            <%=t('field.common.description')%>
        </th>
        <th id="accountAmountHeaderID">
            <%=t('field.account.amount')%>
        </th>
        <th></th>
        <th></th>
      </tr>
      </thead>
    </table>
    <div id="dataWrapperID"></div>
  </div>
</div>

<script type="text/javascript">
    jQuery(document).ready(function(){
       accountsJS.init(<%=@account_type%>);
    });
</script>